<template>
	<div style="display:flex;flex-direction: row;justify-content: space-between;background:rgb(84, 92, 100);">
		<div style="height:60px;font-size: 18px;font-weight: bolder;color: gold;line-height: 60px;padding-left: 24px; ">
			生鲜菜购后台管理系统
		</div>
		<div>
			<el-menu default-active="" background-color="#545c64" class="el-menu-demo" mode="horizontal"
				text-color="#ffffff">
				<el-menu-item>
					<el-dropdown trigger="click">
						<div style="height:100%;">
							<i class="el-icon-user"></i>
							<span style="color:#fff">{{roleName}}</span>
							<i class="el-icon-caret-bottom" />
						</div>
						<el-dropdown-menu>
							<el-dropdown-item @click.native="personInfo">
								<span style="display:block;">个人信息</span>
							</el-dropdown-item>
							<el-dropdown-item @click.native="logout">
								<span style="display:block;">退出系统</span>
							</el-dropdown-item>
						</el-dropdown-menu>
					</el-dropdown>
				</el-menu-item>
			</el-menu>
		</div>
		<el-dialog title="个人信息" :visible.sync="show">
			<el-form :model="info" ref="info">
				<el-row>
					<el-col :span="10" :offset="0">
						<el-form-item label="账号" prop="empAccount" label-width="80px">
							<el-input v-model="info.empAccount" disabled filterable clearable
								placeholder="请输入账号"></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="10" :offset="0">
						<el-form-item label="密码" prop="empPassword" label-width="80px">
							<el-input v-model="info.empPassword" disabled filterable clearable
								placeholder="请输入密码"></el-input>
						</el-form-item>
					</el-col>
				</el-row>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button type="primary" @click="show=false">确 定</el-button>
			</div>
		</el-dialog>
	</div>

</template>

<script>
	import axios from "axios"
	export default {
		name: "wn-header",
		data() {
			return {
				role: "",
				roleName: "",
				info: {},
				show: false,
				status: [{
					value: '0',
					label: '停用'
				}, {
					value: '1',
					label: '启用'
				}]
			}
		},
		methods: {
			personInfo() {
				this.show = true;
				axios.get("/api/admin/emp/getInfoByEmpId")
					.then(res => {
						if (res.data.code == 200) {
							this.info = res.data.data;
						}
					})
			},
			logout() {
				localStorage.removeItem("token");
				this.$router.push("/login");
			},
		},
		// mounted() {
		// 	axios.get("/api/admin/role/getAllByEmpId")
		// 		.then(res => {
		// 			if (res.data.code == 200) {
		// 				this.role = res.data.data;
		// 				this.roleName = this.role[0].roleName
		// 			}
		// 		})
		// }
	}
</script>

<style>

</style>